﻿@{
    ViewBag.Title = "数据库对比";
}

<h2>数据库对比</h2>
@using (Html.BeginForm("CompareTable", "SQL", FormMethod.Post, new { id = "compareForm", @class = "form-horizontal" }))
{
    <div class="form-group">
        <label for="txtsqlConnA" class="col-sm-3 control-label">数据库链接字符串</label>
        <div class="col-sm-9">
            <input type="text" class="form-control" id="txtsqlConnA" placeholder="数据库链接字符串">
        </div>
    </div>

    <div class="form-group">
        <label for="txtsqlConnB" class="col-sm-3 control-label">数据库链接字符串</label>
        <div class="col-sm-9">
            <input type="text" class="form-control" id="txtsqlConnB" placeholder="数据库链接字符串">
        </div>
    </div>

    <div class="form-group">
        <div class="col-sm-offset-3 col-sm-9">
            <button type="button" onclick="GetList()" class="btn btn-default">确定</button>
        </div>
    </div>
}

<div>
    <div class="panel panel-default">
        <div class="panel-body table-responsive">
            <table class="table table-bordered table-striped">
                <thead>
                    <tr>
                        <th>表名A</th>
                        <th>字段名A</th>
                        <th>字段名B</th>
                        <th>表名B</th>
                    </tr>
                </thead>
                <tbody id="templateContent"></tbody>
            </table>
        </div>
    </div>
</div>


<script id="datas" type="text/html">
    {{each listT as valueT i}}
    <tr class="parent" id="{{valueT["TableName"]}}" onclick="Fold(this)">
        <td colspan="4" style="color:red;background-color:#f89846;">{{valueT["TableName"]}}</td>
    </tr>
    {{each list as values i}}
    {{if values["TableNameA"]==""||values["TableNameA"]==null}}
    {{if values["TableNameB"]==valueT["TableName"]}}
    <tr class="child child_{{valueT["TableName"]}}">
        <td style="border:solid 1px #ff0000;"></td>
        <td style="border:solid 1px #ff0000;"></td>
        <td style="border:solid 1px #ff0000;">{{values["ColumnNameB"]}}</td>
        <td style="border:solid 1px #ff0000;">{{values["TableNameB"]}}</td>
    </tr>
    {{/if}}
    {{else if values["TableNameA"]==valueT["TableName"]}}
    {{if values["TableNameA"]!=values["TableNameB"]}}
    <tr class="child child_{{valueT["TableName"]}}">
        <td style="border:solid 1px #ff0000;">{{values["TableNameA"]}}</td>
        <td style="border:solid 1px #ff0000;">{{values["ColumnNameA"]}}</td>
        <td style="border:solid 1px #ff0000;"></td>
        <td style="border:solid 1px #ff0000;"></td>
    </tr>
    {{else}}
    <tr class="child child_{{valueT["TableName"]}}">
        <td>{{values["TableNameA"]}}</td>
        <td>{{values["ColumnNameA"]}}</td>
        <td>{{values["ColumnNameB"]}}</td>
        <td>{{values["TableNameB"]}}</td>
    </tr>
    {{/if}}
    {{/if}}
    {{/each}}
    {{/each}}
</script>

<script type="text/javascript">
    function Fold(obj) {
        $(obj).siblings('.child_' + obj.id).toggle();  // 隐藏/显示所谓的子行
    }
    function GetList() {
        $("#templateContent").html('');
        $.post($("#compareForm").attr("action"), { connStrA: $("#txtsqlConnA").val(), connStrB: $("#txtsqlConnB").val() }, function (datas) {
            var html = template('datas', datas);
            $("#templateContent").append(html);
            $(".parent").siblings('.child').toggle();
        });
    }
</script>
<style>
    .parent {
        cursor: pointer;
    }
</style>